<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="./jquery3.3.1.js"></script>
</head>
<body>
    <div id="box">
        <h2>标题</h2>
        <p>内容</p>
    </div>
    <script>
        $(function(){
            // remove()删除整个节点
            // $("#box").click(function(){
            //     $(this).remove()
            // })

            // empty():清空节点的内容
            //  $("#box").click(function(){
            //     $(this).empty()
            // })

            // detach():删除整个节点,保留元素的绑定事件,附加的数据
            $("#box").click(function(){
                alert(111);
            })
           
            var obj=$("#box").detach();
            $("body").append(obj);
        })
    </script>
</body>
</html>